<template>
  <a-tree-select
    v-model:value="value"
    style="width: 100%"
    :tree-data="treeData"
    tree-checkable
    allow-clear
    :show-checked-strategy="SHOW_PARENT"
    placeholder="Please select"
    tree-node-filter-prop="label"
  />
</template>
<script setup>
import { ref, watch } from "vue";
import { TreeSelect } from "ant-design-vue";
const SHOW_PARENT = TreeSelect.SHOW_PARENT;
const treeData = [
  { value: 1, label: "1", pid: 0 },
  { value: 2, label: "2", pid: 1 },
  { value: 3, label: "3", pid: 1 },
  { value: 4, label: "4", pid: 3 },
  { value: 5, label: "5", pid: 3 },
];
const value = ref(["0-0-0"]);
watch(value, () => {
  console.log(value.value);
});
</script>
